<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

<th:block th:include="include :: head" />

<body>
    <!-- Top Bar Start -->
    <div class="topbar">
        <th:block th:include="include :: topbar" />
    </div>
    <!-- Top Bar End -->
    <!-- Left Sidenav -->
    <div class="left-sidenav">
        <th:block th:include="include :: left-sidenav" />
    </div>
    <!-- end left-sidenav-->
    <div class="page-wrapper">
        <!-- Page Content-->
        <div class="page-content">
            <div class="container-fluid">
                <!-- Page-Title -->
                <div class="row">
                    <div class="col-sm-12">
                        <div class="page-title-box">
                            <div class="float-right">
                                <ol class="breadcrumb">
                                    <li class="breadcrumb-item"><a href="javascript:void(0);">Crovex</a></li>
                                    <li class="breadcrumb-item active">我的活动</li>
                                </ol>
                            </div>
                            <h4 class="page-title">我参加的活动</h4>
                        </div>
                        <!--end page-title-box-->
                    </div>
                    <!--end col-->
                </div><!-- end page title end breadcrumb -->
                <div class="row">
                    <div class="col-lg-12">
                        <div class="card">
                            <div class="card-body">
                                <h4 class="header-title mt-0">Contextual classes </h4>
                                <p class="text-muted mb-3">Use contextual classes to color table rows or individual
                                    cells. </p>
                                <div class="table-responsive-sm">
                                    <table class="table mb-0">
                                        <thead>
                                            <tr>
                                                <th scope="col">#</th>
                                                <th scope="col">活动名称</th>
                                                <th scope="col">开始时间</th>
                                                <th scope="col">结束时间</th>
                                                <th scope="col">是否完结</th>
                                                <th scope="col">操作</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr th:class="${actStat.index % 2 == 0?'':'table-success'}"  th:each="activity,actStat:${activityList}">
                                                <th scope="row" th:text="${actStat.index + 1}"></th>
                                                <td class="" th:text="${activity.taskName}"></td>
                                                <td class="" th:text="${activity.startTime}"></td>
                                                <td class="" th:text="${activity.endTime}"></td>
                                                <td class="" th:text="${activity.taskState==8?'true':'false'}"></td>
                                                <td class="">
                                                    <a th:href="@{'/main/modify?taskName=' + ${activity.taskName} + '&taskId=' + ${activity.taskId} + '&activityId=' + ${activity.activityId}}" th:text="${activity.taskState==8?'':'补签'}"></a>
                                                    <a id="evaluate" th:href="'javascript:evaluate(' + '\'' + ${activity.taskName} + '\',\'' + ${loginUser.userId} + '\',\'' + ${activity.activityId} + '\',\'' + ${activity.taskId} + '\');'" th:text="${activity.taskState==8?'':'评价'}"></a>

<!--                                                    th:href="@{'/user/'+${activity.taskId}}"-->
                                                </td>
                                            </tr>
                                        </tbody>
                                    </table>
                                    <!--end /table-->
                                </div>
                                <!--end /tableresponsive-->
                            </div>
                            <!--end card-body-->
                        </div>
                        <!--end card-->
                    </div>
                    <!--end col-->
                </div>
                <!--end row-->
            </div><!-- container -->
            <th:block th:include="include :: footer"/>
            <!--end footer-->
        </div><!-- end page content -->
    </div><!-- end page-wrapper -->
    <script>
        function evaluate(taskName,userId,activityId,taskId) {
            var ii = layer.load(0, {shade: false});
            var header = $("meta[name='_csrf_header']").attr("content");
            var token =$("meta[name='_csrf']").attr("content");
            $.ajax({
                cache: false,
                type: "POST",
                url: "../action/evaluate",
                contentType: 'application/json;charset=UTF-8',
                data: JSON.stringify({
                    "userId": userId ,
                    "taskName": taskName,
                    "activityId": activityId,
                    "taskId": taskId
                }),
                async: true,
                beforeSend : function(xhr) {
                    xhr.setRequestHeader(header, token);
                },
                success: function (data) {
                    layer.close(ii);
                    if (data.code == '200') {
                        layer.msg(taskName + ',评价成功!', {
                            icon: 1,
                            time: 2000 //2秒关闭（如果不配置，默认是3秒）
                        }, function () {
                        });
                    } else {
                        layer.msg(data.msg + ',评价失败!', {
                            icon: 2,
                            time: 2000 //2秒关闭（如果不配置，默认是3秒）
                        }, function () {
                        });
                    }
                },
            });
        }
        // $(function (){
        //     $('#evaluate').on('click',function () {
        //         event.preventDefault();
        //         layer.msg('建议手动去App进行评价，目前该功能尚未开放!', {
        //             icon: 2,
        //             time: 2000 //2秒关闭（如果不配置，默认是3秒）
        //         }, function () {
        //         });
        //     })
        // })
    </script>
</body>

</html>